﻿@page "/category/{Id:int}"
@inherits CategoryBase

<PageTitle>分类文章</PageTitle>


<link rel="stylesheet" href="css/blog.css" />
<style>
    .article-item .read-more a {
        padding: 5px;
        font-size: 16px;
        color: #91bed3;
    }

    .article-item .read-more a:hover {
        color: #6bc30d !important;
    }
</style>


<div class="container-fixed">
    <div class="col-content">
        <div class="inner">
            <article class="article-list bloglist" id="LAY_bloglist">

                @foreach (var art in articles)
                {
                    <section class="article-item zoomIn article">
                        <!-- <div class="fc-flag">置顶</div> -->
                    <h5 class="title">
                            <span class="fc-blue">【原创】</span>
                            <a href="/article/@art.Id"> @art.Title </a>
                        </h5>
                        <div class="time">
                            <span class="day"> @Utils.UnixTimeStampToDateTime(art.Created_at).ToString("dd") </span>
                            <!-- <span class="month fs-18">1<span class="fs-14">月</span></span> -->
                        <span class="year fs-18 ml10">
                                @Utils.UnixTimeStampToDateTime(art.Created_at).ToString("yyyy年MM月") </span>
                        </div>
                        <div class="content">
                            <a href="read.html" class="cover img-light">
                                <img src="image/cover/2019121192339714.png">
                            </a>

                            @art.Description
                        </div>
                        <div class="read-more">
                            <a href="detail.html" class="fc-black f-fwb">继续阅读</a>
                        </div>
                        <aside class="f-oh footer">
                            <div class="f-fr">
                                <!-- 阅读量 -->
                            <span class="read">
                                    <i class="fa fa-eye fs-16"></i>
                                    <i class="num">0</i>
                                </span>
                                <!-- 评论数 -->
                            <span class="ml20">
                                    <i class="fa fa-comments fs-16"></i>
                                    <a href="javascript:void(0)" class="num fc-grey">0</a>
                                </span>
                            </div>
                        </aside>
                    </section>
                }

            </article>
        </div>
    </div>
    <div class="col-other">
        <div class="inner">
            <div class="other-item" id="categoryandsearch">
                <!-- 搜索 -->
                <div class="search">
                    <label class="search-wrap">
                        <input type="text" id="searchtxt" placeholder="输入关键字搜索" />
                        <span class="search-icon">
                            <i class="fa fa-search"></i>
                        </span>
                    </label>
                    <ul class="search-result"></ul>
                </div>

                <!-- 分类 -->
                <ul class="category mt20" id="category">
                    <li data-index="0" class="slider"></li>

                    @foreach (var cate in categories)
                    {
                        <li><a href="/category/@cate.Id">@cate.Name</a></li>
                    }

                    @*<li><a href="/Blog/Article/4/">ASP.NET MVC</a></li>
                        <li><a href="/Blog/Article/5/">其它</a></li>*@

                </ul>
            </div>

            <!--右边悬浮 平板或手机设备显示-->
            <div class="category-toggle"><i class="layui-icon">&#xe603;</i></div>
            <div class="article-category">
                <div class="article-category-title">分类导航</div>

                @foreach (var cate in categories)
                {
                    <li><a href="/category/@cate.Id">@cate.Name</a></li>
                }

                <div class="f-cb"></div>
            </div>

            <!--遮罩-->
            <div class="blog-mask animated layui-hide"></div>

            <!-- 热门文章 -->
            <div class="other-item">
                <h5 class="other-item-title">热门文章</h5>
                <div class="inner">
                    <ul class="hot-list-article">
                        <li> <a href="/Blog/Read/9">2018最新版QQ音乐api调用</a></li>
                        <li> <a href="/Blog/Read/12">模板分享</a></li>

                    </ul>
                </div>
            </div>

            <!-- 置顶推荐 -->
            <div class="other-item">
                <h5 class="other-item-title">置顶推荐</h5>
                <div class="inner">
                    <ul class="hot-list-article">
                        <li> <a href="/Blog/Read/16">.NET Spire.Doc组件</a></li>
                        <li> <a href="/Blog/Read/14">MUI框架-快速开发APP</a></li>
                        <li> <a href="/Blog/Read/9">2018最新版QQ音乐api调用</a></li>
                    </ul>
                </div>
            </div>

        </div>
    </div>
</div>